<template>
  <div>
    <page-nav :titlearr="titlearr"></page-nav>
    <div class="course_form">
      <el-input v-model="searchText"></el-input>
      <el-button type="primary"
                 @click="search">查询</el-button>
      <el-button type="success"
                 @click="turnAdd">添加</el-button>
    </div>
    <course-table></course-table>
  </div>
</template>
<script>
import pageNav from '../../components/pageNav'
import courseTable from './courseTable'
import { mapActions } from 'vuex'
export default {
  name: "course",
  components: {
    pageNav, courseTable
  },
  methods: {
    ...mapActions("courseStore", ["getCourseAction"]),
    search () { //搜索
      this.getCourseAction({ searchText: this.searchText })
      this.searchText = ""
    },
    turnAdd () { //跳转课程添加
      this.$router.push({ name: "courseAdd" })
    }
  },
  data () {
    return {
      searchText: "",//搜索文本
      titlearr: [
        { name: "home", text: "首页" },
        { name: "course", text: "课程管理" },
        { name: "course", text: "课程列表" },
      ]
    }
  }
}
</script>
<style lang="less" scoped>
.course_form {
  width: 1300px;
  margin: 10px auto;
  background: white;
  display: flex;
  .el-input {
    width: 300px;
  }
}
</style>